<template>
	<view class="card">
		<view class="title flex_a_c">
			<view class="title_l">
				{{title}}
			</view>
			<view class="gd flex_a_c">
				<text @click="toMore">查看更多</text>
				<image style="width: 12rpx;height: 30rpx;margin-left: 10rpx;" src="../static/image/back.png"></image>
			</view>
		</view>
		<view class="tabel">
			<view class="header flex_a_c">
				<view class="" style="width: 60%;">
					项目名称
				</view>
				<view class="" style="width: 20%">
					{{field[type]}}
				</view>
				<view class="" style="width: 20%;text-align: center;">
					操作
				</view>
			</view>
			<view v-if="true">
				<template v-for="item in data">
					<view class="data flex_a_c">
						<view class="item" style="width: 60%;">
							{{type==3?item.project_name: item.name}}
						</view>
						<view class="item" style="width: 20%;">
							{{type==1?ps[item.status]:(type==2?bs[item.status]:item.price)}}
						</view>
						<view class="item" style="color: #0074FF;width: 20%;" @click="toPage(item)">
							查看详情
						</view>
					</view>
				</template>
			</view>
			<view v-else class="flex_a_c" style="justify-content: center;padding-top: 30rpx;">
				<image style="width: 300rpx;height: 200rpx;" src="../static/image/none.png"></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'cardCom',
		props: {
			title: {
				type: String,
				default: ''
			},
			type: {
				type: Number,
				default: 1
			},
			data: {
				type: Array,
				default: []
			}
		},
		data() {
			return {
				field: ['', '项目状态', '投标状态', '业绩'],
				ps: ['未开始', '立项分析', '信息立项', '资格审核', '放弃', '竣工'],
				bs: ['未中标', '已中标'],
			}
		},
		computed: {

		},
		onLoad() {

		},
		methods: {
			toPage(item) {
				if (this.type == 1) {
					this.$fun.toPage('/pagesA/projectm/form?edit=1&id=' + item.id)
				}
				if (this.type == 2) {
					this.$fun.toPage('/pagesA/Bid/form?edit=1&id=' + item.id)
				}
				if (this.type == 3) {
					this.$fun.toPage('/pagesA/performance/form?edit=1&id=' + item.id)
				}
			},
			toMore(){
				if (this.type == 1) {
					this.$fun.toPage('/pagesA/projectm/projectm')
				}
				if (this.type == 2) {
					this.$fun.toPage('/pagesA/Bid/Bid')
				}
				if (this.type == 3) {
					this.$fun.toPage('/pagesA/performance/performance')
				}
			}
		}
	}
</script>

<style lang="scss">
	.card {
		margin-top: 20rpx;
		box-sizing: border-box;

		.title {
			justify-content: space-between;

			.title_l {
				font-size: 32rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #000000;
			}

			.gd {
				text {
					font-size: 26rpx;
					font-weight: 400;
					color: #9CA3B4;
				}
			}
		}

		.tabel {
			margin-top: 30rpx;
			background-color: #FBFCFF;
			border-radius: 10rpx;
			border: 1px solid #E9F0FD;
			box-sizing: border-box;

			.header {
				background-color: #E9F0FD;
				border-radius: 10rpx 10rpx 0 0;
				padding: 20rpx;
				font-size: 24rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #555555;
			}

			.data {
				border-bottom: 1px solid #E9F0FD;

				.item {
					padding: 20rpx;
					font-size: 20rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #3D3D3D;
				}
			}

			.data:last-child {
				border: none;
			}
		}
	}
</style>